﻿@using ZX.Tools
@using ZX.Model
@model CompanyPosition
<link href="~/Static/styles/theme/default/all.css" rel="stylesheet" />
<link href="~/Static/styles/theme/zui/css/min.css" rel="stylesheet" />
<link href="~/Static/js/jquery/chosen/chosen.min.css" rel="stylesheet" />
<link href="~/Static/js/jquery/zTree/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" />
<link href="~/Static/js/layui/css/layui.css" rel="stylesheet" />
<link href="/Static/styles/bootstrap.min.css" rel="stylesheet" />
<link href="~/Static/js/layer/need/layer.css" rel="stylesheet" />
<script src="/Static/js/jquery/jquery-1.11.1.min.js"></script>
<script src="/Static/js/jquery/form/min.js"></script>
<script src="~/Static/js/admin.min.js"></script>
<script src="~/Static/js/jquery/jquery-migrate-1.2.1.js"></script>
<script src="~/Static/js/Validform/js/Validform_v5.3.2_min.js"></script>
<script src="~/Static/js/jquery/zTree/js/jquery.ztree.all-3.1.min.js"></script>
<script src="~/Static/js/jquery/chosen/chosen.min.js"></script>
<script src="~/Static/js/zui/zui.min.js"></script>
<script src="~/Static/js/layui/layui.js"></script>
<script src="~/Static/js/layer/layer.js"></script>
<script src="~/Static/js/layer/layer.tools.js"></script>
<style>
    .need {
        color: red;
    }

    .layui-form-label {
        width: 100px;
    }

    .layui-form-item {
        position: center;
        margin-left: 80px;
    }

    .layui-input {
        width: 60% !important;
    }

    #submit {
        position: absolute;
        left: 35%;
        top: 60%;
    }

    #close {
        position: absolute;
        left: 50%;
        top: 60%;
    }
</style>
<form action="/CompanyPosition/SaveData" method="post" class="layui-form" id="formCompanyPosition" style="padding-top: 30px;">
    <input type="hidden" name="Id" value="@Model.Id" />
    <input type="hidden" name="ParentId" value="@Model.ParentId" />
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="need">*</span>上级职位</label>
        <div class="layui-input-block">
            <input type="text" class='layui-input' placeholder="上级职位" size="30" value="@(ViewBag.CompanyPositionName ?? "无")" readonly="readonly" onclick="showSysCompanyPosition();">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="need">*</span>职位名称</label>
        <div class="layui-input-block">
            <input type="text" class='layui-input' name="Name" value="@Model.Name" placeholder="职位名称" autocomplete="off" datatype="*">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="need">*</span>排序</label>
        <div class="layui-input-block">
            <input type="text" class='layui-input' name="Sort" value="@Model.Sort" placeholder="排序" autocomplete="off" datatype="*"
                   onkeypress="$.admin.keyPress(this)"
                   onkeyup="$.admin.keyUp(this)"
                   onblur="$.admin.keyBlur(this)">
        </div>
    </div>
    <div class="footer_form">
        <button type="button" class="layui-btn" id="close" onclick="win.close();">关闭</button>&nbsp;
        <button type="button" class="layui-btn" id="submit" onclick="saveData()">保存</button>
    </div>
</form>
<div id="sysCompanyPosition" class="CompanyPositionContent" style="display: none; position: absolute;">
    <ul id="treeSysCompanyPosition" class="ztree" style="margin-top: 0;max-height: 280px;"></ul>
</div>
<input type="hidden" id="txtCompanyPositionzTree" value="@ViewBag.TreeJson" />
<script type="text/javascript">
    function saveData() {
        $("#formCompanyPosition").submit();
    }
    var CompanyPositionTree;
    $(function () {
        $("#formCompanyPosition").Validform({
            tiptype: 3,
            callback: function (form) {
                win.showLoading("正在保存...");
                $("#formCompanyPosition").ajaxSubmit(function (data) {
                    if (data.Code == 300) {
                        win.alert(data.Message);
                    } else if (data.Code == 200) {
                        parent.$("#btnSearch").click();
                        parent.win.success(data.Message);
                        win.close();
                    }
                });
                return false;
            }
        });
        var CompanyPositionSetting = {
            view: {
                dblClickExpand: false
            },
            data: {
                simpleData: {
                    enable: true
                }
            },
            callback: {
                onClick: onCompanyPositionClick
            }
        };
        //初始化树形菜单
        var CompanyPositionNodes = eval($("#txtCompanyPositionzTree").val());
        CompanyPositionTree = $.fn.zTree.init($("#treeSysCompanyPosition"), CompanyPositionSetting, CompanyPositionNodes);
    });
    //点击选择菜单
    function onCompanyPositionClick(e, treeId, treeNode) {
        $("#formCompanyPosition input[name='ParentId']").val(treeNode.id);
        $("#txtSysCompanyPosition").val(treeNode.name);
        hideSysCompanyPosition();
    }
    //显示菜单
    function showSysCompanyPosition() {
        var cityObj = $("#txtSysCompanyPosition");
        var cityOffset = $("#txtSysCompanyPosition").offset();
        $("#treeSysCompanyPosition").width(cityObj.width());
        $("#sysCompanyPosition").css({ left: cityOffset.left + "px", top: cityOffset.top + cityObj.outerHeight() + "px" }).slideDown("fast");
        $("body").bind("mousedown", onAddSysCompanyPositionBodyDown);
    }
    //隐藏菜单
    function hideSysCompanyPosition() {
        $("#sysCompanyPosition").fadeOut("fast");
        $("body").unbind("mousedown", onAddSysCompanyPositionBodyDown);
    }
    //隐藏菜单
    function onAddSysCompanyPositionBodyDown(event) {
        if (!(event.target.id == "CompanyPositionBtn" || event.target.id == "sysCompanyPosition" || $(event.target).parents("#sysCompanyPosition").length > 0)) {
            hideSysCompanyPosition();
        }
    }
</script>
